<template>
	<view>
		<cu-custom bgColor="bg-white" :isBack="true">		<block slot="backText"></block>
			<block slot="content">提现记录</block>
		</cu-custom>
		<!-- <view class="bg-white overflow padding solid-bottom">
			<view class="text-black">总提现金额：<text class="text-price text-blue text-bold">{{total?total:0}}</text></view>
		</view>
		<view class="bg-white">
			<block v-for="(item,index) in list" :key="index">
				<view class="space-between padding solid-bottom">
					<view class="">
						<view>提现金额：<text class="text-price text-bold text-xl">{{item.cash}}</text></view>
						<view>实际到账：<text class="text-price text-orange">{{item.money}}</text></view>
						<view>申请时间：{{$common.timeFormat(item.created_at)}}</view>
						<view>提现编号：{{item.withdraw_no}}</view>
						<view v-if="item.withdraw_status==1">审核时间：{{$common.timeFormat(item.payment_date)}}</view>
						<view v-if="item.withdraw_status==-1">驳回原因：{{item.memo}}</view>
					</view>
					<view class="ctr">
						<text class="text-blue" v-if="item.withdraw_status==0">审核中</text>
						<text class="text-orange" v-if="item.withdraw_status==-1">被驳回</text>
						<text class="text-black" v-if="item.withdraw_status==1">已打款</text>
					</view>
				</view>
			</block>
			<view class="cu-load margin-center" :class="loading?'loading':'over'"></view>
		</view> -->
		
		<view>
			
			
			<!-- <view class="whole-box" style="background-image: url(https://pingtuan-1251091607.cos.ap-shanghai.myqcloud.com/images/2021/03/10/image_1615357505_aCuJdqd0.png);background-size: 100% 100%;"> -->
				<view class="whole-box">
				<view class="gold-black-box">
					
					<view class="top-box">
						<!-- <image class="top-box-bg" src="@/static/black_bg/stander-box.png" mode="aspectFill"></image> -->
						<view class="top-box-content">
							<view class="note-price">
								<text class="note">提现记录</text>
								<text class="price text-price">{{total > 0 ? total : 0 }}</text>
							</view>
							<!-- <image class="icon-gold-tixian" src="@/static/icon-gold-money.png" mode="aspectFill"></image> -->
						</view>
					</view>
					
					<view class="list">
						<scroll-view scroll-y :style="'height:'+scrollHeight+'px'" @scrolltolower="getMore">
							<block v-for="(item,index) in list" :key="index">
							<view class="my-data-box">
								<!-- <image class="my-data-box-bg" src="@/static/black_bg/stander-box.png" mode="aspectFill"></image> -->
								<view class="my-data-box-content">
									<view class="left-box">
										<view class="title" v-if="item.type == 'money'">余额提现</view>
										<view class="title" v-else>积分提现</view>
										<view class="time">{{$common.timeFormat(item.created_at)}}</view>
										<view class="title" style="font-size: 12px;">
											<text class="text-orange text-sh" v-if="item.withdraw_status==0">审核中</text>
											<text class="text-orange text-sh" v-if="item.withdraw_status==-1">被驳回，原因： {{item.memo}}</text>
											<text class="text-orange text-sh" v-if="item.withdraw_status==1">已打款</text>
										</view>
										
									</view>
									<view class="num up" >-{{item.cash}}</view>
								</view>
							</view>
							</block>
						</scroll-view>
					</view>
					
				</view>
			</view>
		</view>
	</view>
	
	
	
</template>




<script>
	export default {
		data() {
			return {
				member: null,
				total: 0,
				CLOUDPATH: this.$config.cloudPath,
				theme: this.$config.THEME(),
				list: [],
				hasMore: true,
				loading: false,
				page: 1,
			}
		},
		onLoad(options) {
			if (this.$common.loginAuth(true)) {}
		},
		onShow() {
			if (this.$common.loginAuth(true)) {
				this.$common.getMember().then((member) => {
					this.member = member
					this.getList()
				})
			}
		},
		methods: {
			getList() {
				if (this.hasMore && !this.loading) {
					this.loading = true
					this.$http
						.get('withdraw', {
							page: this.page
						})
						.then((response) => {
							let list = this.list
							if (response.data.data.list.length > 0) {
								list = list.concat(response.data.data.list)
							} else {
								this.hasMore = false
							}
							this.total = response.data.data.total
							this.list = list
							this.page += 1

							this.loading = false
							uni.hideLoading()
						})
						.catch((response) => {
							uni.hideLoading()
						})

				}
			}
		},
		onReachBottom() {
			this.getList()
		}
	}
</script>

<style>
	.whole-box{
		background-image: url(../../../static/red-new/new-back.png);
		background-size: 100% 100%;
		min-height: calc(100vh - 45px - 24rpx);
		padding: 12px 0;
	}
	.gold-black-box{
		padding: 12px 0;
		margin: 0 10rpx;
		/* border: 2rpx solid #999999; */
		/* border-radius: 30rpx; */
		display: flex;
		flex-direction: column;
		align-items: center;
		/* background-color: #FFF7D2; */
		
	}
	
	.gold-black-box .top-box{
		/* margin-top: 25rpx; */
		width: 690rpx;
		height: 276rpx;
		/* border: 2rpx solid #999999; */
		/* border-radius: 30rpx; */
		overflow: hidden;
		position: relative;
		/* background: -webkit-linear-gradient(left, #FFF7D2, #FFF7D2, #FFF4C5, #FFF4C5); */
		background-color: #ffffff;
		width: 90%;
		margin: 0 auto;
	}
	.top-box .top-box-bg{
		width: 100%;
		height: 100%;
	}
	.top-box .top-box-content{
		width: 690rpx;
		/* height: 276rpx; */
		position: absolute;
		left: 0;
		top: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 30rpx;
		padding: 0 30rpx;
	}
	.top-box-content .note-price{
		flex: 1;
		height: 102rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.note-price .note{
		font-size: 36rpx;
		font-weight: bold;
		color: #000000;
	}
	.note-price .price{
		font-size: 50rpx;
		font-weight: bold;
		color: #000000;
		margin-top: 15px;
	}
	.top-box-content .icon-gold-tixian{
		width: 92rpx;
		height: 106rpx;
		flex-shrink: 0;
		margin-left: 20rpx;
	}
</style>

<style>
	.gold-black-box .list{
		margin-top: 10px;
	}
	.list .my-data-box{
		margin-top: 20rpx;
		width: 660rpx;
		height: 200rpx;
		/* border: 2rpx solid #999999; */
		/* border-radius: 30rpx; */
		overflow: hidden;
		position: relative;
		/* background: -webkit-linear-gradient(left, #FFF7D2, #FFF7D2, #FFF4C5, #FFF4C5); */
		background-color: #ffffff;
		
		
	}
	.list .my-data-box:first-child{
		margin-top: 0;
	}
	.my-data-box .my-data-box-bg{
		width: 100%;
		height: 100%;
	}
	.my-data-box .my-data-box-content{
		width: 690rpx;
		height: 200rpx;
		position: absolute;
		left: 0;
		top: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 40rpx;
	}

	.my-data-box-content .left-box{
		/* flex: 1; */
		display: flex;
		flex-direction: column;
		align-items: space-between;
	}
	.left-box .title{
		width: 	450rpx;
		font-size: 34rpx;
		font-weight: bold;
		color: #000000;
		overflow: hidden;    
		/* text-overflow:ellipsis;    */
		/* white-space: nowrap; */
	}
	.left-box .time{
		margin-top: 16rpx;
		font-size: 34rpx;
		color: #000000;
		width: 200px;
	}
	.my-data-box-content .num{
		/* margin-left: -20rpx; */
		font-size: 40rpx;
		font-weight: bold;
		color: #1A181E;
		float: right;
		margin-right: 30px;
	}
	.my-data-box-content .num.up{
		color: #1A181E;
	}
	.item .num.down{
		color: #1A181E;
	}
	.text-sh{
		color: #1A181E;
	}
</style>

<style>
</style>
